import React, { Component, Suspense } from "react";
import PageHeaderWrapper from "@/components/PageHeaderWrapper";
import { connect } from "dva";
import PageLoading from "@/components/PageLoading";
import { Row, Col, Card, Button, Input, Modal, message, Drawer, Icon, Layout, Spin, } from "antd";
import { searchFile, knowledgeListFile } from "@/services/knowledgeFile";
import styles from "./index.less";
import UserSession from "@/UserSession";
import { getAuthority } from "@/utils/judgeAuthority";
const LeftTree = React.lazy(() => import("./leftTree/index"));
const FileList = React.lazy(() => import("./fileList/index"));
const { Header, Content, Footer, Sider } = Layout;
let checkInterval = null;

class OverView extends Component {
	constructor(props) {
		super(props);
		this.state = {
			globalLoading: true,
			code: "",
			tableLoading: true,
			nodeId: "",
			nodeIdName: "所有分类",
			nodePath: "",
			parentId: "0",
			isShard: false,
			query: {
				current: 1,
				size: 10,
				title: '',
				categoryId: '',
				docType: '',
				docStatus: '',
				status: '',
			},
			total: 0,
			list: [],
		};
	}

	componentDidMount() {
		this.checkImport()
	}

	checkImport = async () => {
		this.isShowGlobalLoading(false)
		setTimeout(() => {
			if (this.LeftTree) {
				this.LeftTree.fetch(true)
			}
		}, 300)
	}

	// ----树形图方法开始----
	terrNodeId = (nodeId, nodeIdName, nodePath, isShard, parentId) => {
		let { query } = this.state;
		query.current = 1;
		query.size = 10;
		query.categoryId = nodeId === "" ? `${currentUser.robotId}-root` : nodeId;
		this.setState({ nodeId, nodeIdName, nodePath, isShard, parentId, query }, () => {
			this.fetchFileList();
		});
	};

	// 停用启用变更需要刷新列表
	refresh = (code) => {
		this.setState({ code });
	};
	// ----树形图方法结束----

	fetchFileList() {
		// console.log(this.state);

		const { query, nodeId } = this.state;
		const { dispatch, match: { params: { id }, }, currentUser } = this.props;
		let object = { ...query };
		this.setState({ tableLoading: true }, async () => {
			// object.size = query.limit;
			// object.current = query.page;
			object.categoryId = nodeId === "" ? `${currentUser.robotId}-root` : nodeId;
			// object.categoryParentPath = parentPath;
			object.isHeadquarters = UserSession.isSystemKnowledge();
			if (UserSession.isSystemKnowledge()) {
				let res = await knowledgeListFile(object);
				this.setState({
					list: res.records,
					total: res.total,
					searchObj: object,
					loading: false,
					tableLoading: false,
					qaIdList: [],
					classId: "",
					selectedRowKeys: [],
				}, () => {
					// this.FileListCom.resetSelectRowKeys()
					const syncingList = res.records.filter(item => item.syncStatus == 2);

					//有同步中的数据 且没有开定时器 则需要打卡定时器
					if (syncingList.length > 0 && !checkInterval) {
						checkInterval = setInterval(() => {
							this.fetchFileList()
						}, 5000)
					}

					//没有同步中的数据 则需要关闭定时器
					if (syncingList.length == 0) {
						clearInterval(checkInterval)
					}
				});
			} else {
				let res = await searchFile(object)
				this.setState({
					list: res.records,
					total: res.total,
					searchObj: object,
					loading: false,
					tableLoading: false,
					qaIdList: [],
					classId: "",
					selectedRowKeys: [],
				}, () => {
					// this.FileListCom.resetSelectRowKeys()
					const syncingList = res.records.filter(item => item.syncStatus == 2 || item.syncStatus == 3);

					//有同步中的数据 且没有开定时器 则需要打卡定时器
					if (syncingList.length > 0 && !checkInterval) {
						checkInterval = setInterval(() => {
							this.fetchFileList()
						}, 5000)
					}

					//没有同步中的数据 则需要关闭定时器
					if (syncingList.length == 0) {
						clearInterval(checkInterval)
						checkInterval = null
					}
				});
			}
		});
	};
	fetchGraphListByPage = (page, limit, values) => {
		let { query } = this.state;
		query.current = page;
		query.size = limit;
		query.title = values?.key;
		query.docType = values?.queryType;
		query.docStatus = values?.qaType;
		query.status = values?.status;
		this.setState({ tableLoading: true, query }, () => {
			this.fetchFileList();
		})
	};

	isShowGlobalLoading = (globalLoading) => {
		this.setState({ globalLoading });
	};

	cancelImport = async () => {
		this.isShowGlobalLoading(false)
	}

	componentWillUnmount() {
		console.log('离开了当前页面');
		clearInterval(checkInterval)
		checkInterval = null
	}

	render() {
		const { match: { params: { id }, }, route, location: { params } } = this.props;
		const { list, total, query, globalLoading, tableLoading } = this.state;

		return (
			<Suspense fallback={<PageLoading />}>
				<Layout style={{ minHeight: 'calc(100vh - 64px - 10px - 66px - 20px)' }}>
					<Sider width={260} style={{ background: "#FAFAFA" }} className={styles.siderTree}>
						<Row gutter={16}>
							<Col>
								<LeftTree
									// qaListCz={this.state.qaListCz}
									terrNodeId={this.terrNodeId}
									// refresh={this.refresh}
									// getClass={this.getClass.bind(this)}
									authority={getAuthority(route.authority)}
									onRef={(ref) => (this.LeftTree = ref)}
									getListByTreeRoot={data => this.terrNodeId(data.id, data.title, data.path, false, data.parentId, null)}
									categoryId={id}
									location={this.props.location}
								/>
							</Col>
						</Row>
					</Sider>
					<Content style={{ borderLeft: "1px solid #E6ECF6", background: '#ffffff' }}>
						<Row gutter={16}>
							<Col>
								<Card bordered={false} bodyStyle={{ paddingTop: 10, paddingBottom: 6 }}>
									<FileList
										fileCategoryId={this.state.nodeId}
										fileCategoryName={this.state.nodeIdName}
										fileCategoryPath={this.state.nodePath}
										fileCategoryParentId={this.state.parentId}
										tabPaneList={this.leftTreeList}
										list={list}
										total={total}
										current={query.current}
										graphLoading={tableLoading}
										fetchGraphListByPage={this.fetchGraphListByPage}
										pathId={id}
										authority={getAuthority(route.authority)}
										onRef={(ref) => (this.FileListCom = ref)}
									/>
								</Card>
							</Col>
						</Row>
					</Content>
				</Layout>
				{/* </Spin> */}
			</Suspense>
		);
	}
}

export default connect(({ user }) => ({
	currentUser: user.currentUser,
}))(OverView);
